<template>
  <div>
    <!--列表-->
    <el-table
      ref="table"
      v-loading="tableLoad"
      class="table-info"
      :data="tableData"
      fit
      highlight-current-row
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="sampleNum" label="样品编号"> </el-table-column>
      <el-table-column prop="orderNum" label="委托单号"> </el-table-column>
      <el-table-column prop="sampleName" label="样品名称"> </el-table-column>
      <el-table-column prop="inspectedUnit" label="受检单位"> </el-table-column>
      <el-table-column
        v-if="systemType == 'cdc'"
        prop="samplingDateTime"
        label="采样日期"
      />
      <el-table-column prop="detectionItemName" label="检测项目" />
      <el-table-column prop="sampleCount" label="样品接收数量" />
      <el-table-column label="操作" width="140">
        <template slot-scope="{ row }">
          <div class="base-table-operation">
            <el-link v-rights="'Query'" type="primary" @click="selUnit(row)"
              >查看</el-link
            >
          </div>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <!--BasePagination
      :total="pagination.total"
      :current-page="pagination.pageIndex"
      :page-count="pagination.pageCount"
      @changePage="changePage"
    /-->
    <!-- 样品接收 -->
    <SampleReceivingDialog
      ref="SampleReceivingDialog"
      :system-type.sync="systemType"
      :dialog-form-visible.sync="dialogFormVisible"
      :row-data.sync="rowData"
      :read-only.sync="readOnly"
      @closeSampleReceivingDialog="closeSampleReceivingDialog"
    />
  </div>
</template>

<script>
import SampleReceivingDialog from "./SampleReceivingDialog.vue";
import { getList, exportData } from "../../../api/SampleManage/SampleReceiving";
import { formatTime } from "@/utils/time";

export default {
  name: "SampleReceivingFinished",
  components: { SampleReceivingDialog },
  props: {
    systemType: {
      type: String,
      default: "",
    },
    loadState: {
      type: Boolean,
      default: false,
    },
    filterForm: {
      type: Object,
      default() { },
    },
    pagination: {
      type: Object,
      default: function() {
        return { pageIndex: 1, pageSize: 10 };
      },
    },
  },
  data() {
    return {
      readOnly: false,
      dialogFormVisible: false,
      loading: false,
      // 接收id
      sampleReceivingId: "",
      tableLoad: false,
      tableData: [],
      tableDatas: [],
      rowData: [],
    };
  },
  computed: {},
  watch: {
    loadState(val) {
      if (val) {
        this.getList();
      }
    },
    "pagination.pageIndex"(newV, oldV) {
      this.getList();
    },
  },
  created() {
    this.getList();
  },
  methods: {
    closeSampleReceivingDialog() {
      this.rowData = [];
    },
    // 样品接收
    selUnit(row) {
      this.rowData.push(row);
      this.readOnly = true;
      this.dialogFormVisible = true;
    },
    handleSelectionChange(val) {
      this.tableDatas = val;
    },
    getList(flag) {
      if (flag) {
        this.pagination.pageIndex = 1;
      }
      this.loading = true;
      getList({ ...this.filterForm, ...this.pagination })
        .then((res) => {
          this.tableData = res.data.dataList ? res.data.dataList : [];
          this.pagination.total = res.data.total;
          this.$emit("update:total", res.data.total);
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 切换页码
    // changePage(page) {
    //   this.pagination.pageIndex = page;
    //   this.getList();
    // },
    // 导出
    async exportData() {
      if (this.tableData.length === 0) {
        this.$message.error("暂无数据，无法导出");
        return;
      }
      this.pagination.pageIndex = 1;
      this.pagination.pageSize = 99999;
      this.tableDatas?.forEach(element => {
        this.filterForm.idList.push(element.id);
      });
      const dates = formatTime();
      exportData({ ...this.filterForm, ...this.pagination }).then((res) => {
        var data = new Blob([res.data], { type: 'application/vnd.ms-excel' })
        var link = document.createElement("a");
        link.href = window.URL.createObjectURL(data);
        link.download = "样品接收" + dates + ".xlsx";
        link.click();
      }

      ).catch(() => {

      });

      // 表名
      // const wb = XLSX.utils.book_new();
      // const tHeader = [

      //   "样品编号",
      //   "样品名称",
      //   "样品来源",
      //   "数量",
      //   "接收日期",
      //   "检验项目",
      // ];
      // const filterVal = [
      //   "sampleNum",
      //   "sampleName",
      //   "inspectedUnit",
      //   "sampleCount",
      //   "receivingDate",
      //   "detectionItemName",
      // ];
      // var receiveData = [];
      // if (this.tableDatas && this.tableDatas.length > 0) { receiveData = this.tableDatas; } else {
      //   receiveData = await this.getAllList();
      // }

      // const arr = this.formatJSON(filterVal, receiveData);
      // arr.unshift(tHeader);
      // const ws = XLSX.utils.aoa_to_sheet(arr);
      // XLSX.utils.book_append_sheet(wb, ws);
      // // 输出
      // const wbout = XLSX.write(wb, {
      //   bookType: "xlsx",
      //   bookSST: true,
      //   type: "array"
      // });
      // try {
      //   const dates = formatTime();
      //   FileSaver.saveAs(
      //     new Blob([wbout], { type: "application/octet-stream" }),
      //     "样品接收" + dates + ".xlsx"
      //   );
      // } catch (e) {
      //   if (typeof console !== "undefined") console.log(e, wbout);
      // }
      // return wbout;
    },
    getAllList() {
      return new Promise((resolve) => {
        this.pagination.pageIndex = 1;
        this.pagination.pageSize = 99999;
        getList({ ...this.filterForm, ...this.pagination })
          .then((res) => {
            resolve(res.data.dataList)
          })
          .catch(() => {
          });
      });
    },
    // 数组转JSON
    formatJSON(key, data) {
      return data.map((v) =>
        key.map((i) => {
          return v[i];
        })
      );
    },
  },
};
</script>
